import React from "react";
import style from "./style.module.scss";

import url3 from "../../assets/images/icon/hdpi/common_nav_message_black_n.png";
import url4 from "../../assets/images/icon/hdpi/common_nav_message_black_s.png";

import { useNavigate } from "react-router-dom";
interface PropsType {
  title?: JSX.Element | React.ReactElement | React.ReactNode;
  showSearch?: boolean;
}

export const MyHeader: React.FC<PropsType> = ({
  title,
  showSearch = false,
}) => {
  const navigate = useNavigate();
  return (
    <div className={style["header"]}>
      <div className={style["left"]}>
        <img src={url3} alt="" />
      </div>
      <div className={style["con"]}>
        {showSearch ? (
          <input
            type="text"
            placeholder="病证、药品名称、医生姓名"
            className={style["input"]}
            onFocus={() => navigate("/home/search")}
          />
        ) : (
          title
        )}
      </div>
      <div className={style["right"]}>
        <img src={url4} alt="" />
      </div>
    </div>
  );
};

export default MyHeader;
